<template>
	<view class="container">
		<!-- <load-refresh ref="loadRefresh" 
			:isRefresh="true" 
			refreshType="halfCircle" 
			color="#04C4C4" 
			heightReduce="0"
			backgroundCover="#F3F5F5" 
			@refresh="refresh">
			<view slot="content-list">
				<view class="item" v-for="i in list" :key="i">{{'item_'+i}}</view>
			</view>
		</load-refresh> -->
		<!-- <view>
			<button @tap="startRecord">开始录音</button>
			<button @tap="endRecord">停止录音</button>
			<button @touchstart="startRecord" @touchcancel="endRecord" @touchend="endRecord">摁住录音</button>
			<button @tap="playVoice">播放录音</button>
		</view>
		<view class="">
			hello
			<view class="">
				{{text}}
			</view>
		</view>
		<input type="text" placeholder="不应该弹起" @focus="aa"/>
		<input class="input-view" :class="isFixed?'fixed':''" type="text" placeholder="请输入" adjust-position/> -->
	</view>
</template>

<script>
	import MonitorKeyboard from "@/static/js/monitorKeyboard.js"
	
	const recorderManager = uni.getRecorderManager();
	const innerAudioContext = uni.createInnerAudioContext();
	
	innerAudioContext.autoplay = true;
	export default {
		data() {
			return {
				list: [1,2,3,4,5,6,7,8,9,10],
				isFixed: true,
				text: ""
			}
		},
		onLoad() {
			let self = this;
			recorderManager.onStop(function (res) {
				console.log('recorder stop' + JSON.stringify(res));
				self.voicePath = res.tempFilePath;
			});
			this.monitorKeyboard = new MonitorKeyboard()
			this.monitorKeyboard.onShow((e) => {
				console.log("弹出", e)
				alert("弹出", e)
				this.text = e
			})
			uni.onKeyboardHeightChange(this.bb);
			
			// 测试一下蛤
			let chunks = []
			for(let i in [1,2,3,4,5,6,7,8]) {
				const blob = new Blob(["1","2","3"])
				chunks.push(blob)
			}
			const file = new File(chunks, 'test.mp4', { type: "video/mp4" })
			uni.compressVideo({
				src: file,
				quality: "low",
				success: res => {
					console.log('压缩后视频：',res.tempFilePath)
				},
			})
			// uni.uploadFile({
			// 	url: "https://xzy.maertudtech.com/api/common/upload",
			// 	header: {
			// 		"token": "643534a4-4609-4d61-957b-687fd8c6646f"
			// 	},
			// 	file: file,
			// 	name: 'file',
			// 	formData: {
			// 		"category": 'avatar'
			// 	},
			// 	success: res => {
			// 		console.log(res)
			// 		if (res.statusCode == 200) {
			// 			let data = JSON.parse(res.data)
			// 			if (data.code == 1) {
			// 				this.form[0].value = data.data.fullurl
			// 				// this.form.avatar = data.data.fullurl
			// 			}
			// 		}
			// 	},
			// 	complete: res => {
			// 		console.log(res)
			// 	}
			// })
		},
		methods: {
			aa() {
				this.isFixed = false
			},
			bb(e) {
				console.log(e)
				this.text = "ha"
				this.text = e
			},
			startRecord() {
				console.log('开始录音');
	
				recorderManager.start();
			},
			endRecord() {
				console.log('录音结束');
				recorderManager.stop();
			},
			playVoice() {
				console.log('播放录音');
	
				if (this.voicePath) {
					innerAudioContext.src = this.voicePath;
					innerAudioContext.play();
				}
			},
			// refresh() {
			// 	setTimeout(() => {
			// 		this.list = [1,2,3,4,5,6,7,8,9,10]
			// 		this.$refs.loadRefresh.completed()
			// 	}, 3000)
			// }
		}
	}
</script>

<style>
	.item {
		height: 160rpx;
		line-height: 160rpx;
		padding: 0 20rpx;
	}
	.item:nth-child(2n+1) {
		background-color: aqua;
	}
	.item:nth-child(2n) {
		background-color: bisque;
	}
	
	.input-view.fixed {
		position: fixed;
	}
	
	.input-view {
		margin-top: 1000rpx;
		width: 100vw;
		bottom: 100rpx;
		left: 0;
		right: 0;
		background-color: #f0f0f0;
		height: 120rpx;
		padding: 20rpx;
	}
</style>